import {createApp, inject} from 'vue'
import { createPinia } from 'pinia'

import ElementPlus, {ElMessage} from 'element-plus'
import 'element-plus/dist/index.css'

import App from './App.vue'
import router from './router'
import * as ElementPlusIconsVue from '@element-plus/icons-vue'
import axios from "axios";
import {getWithToken} from "@/net/postAndGetMethodWithToken";
import "./assets/css/common.css";

// 预览组件以及样式
import VMdPreview from '@kangc/v-md-editor/lib/preview';
import '@kangc/v-md-editor/lib/style/preview.css';
// VuePress主题以及样式（这里也可以选择github主题）
import vuepressTheme from '@kangc/v-md-editor/lib/theme/vuepress.js';
import '@kangc/v-md-editor/lib/theme/style/vuepress.css';
import Prism from 'prismjs';
// 代码高亮
import 'prismjs/components/prism-json';
// 选择使用主题
VMdPreview.use(vuepressTheme, {
    Prism,
});


/*来自 @/store/index.js的 Vuex store
其中包含一个名为 state 的对象，该对象包含一个名为 authHeader 的属性，初始值为 { 'Content-Type': 'application/json' }。
然后，定义了一个名为 setAuthHeader 的 mutation，该 mutation 接受一个参数 header，并将其设置为 state.authHeader 的值。*/
import store from  "@/store"

const app = createApp(App)

for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
    app.component(key, component)
}

//替换为你的后端地址
axios.defaults.baseURL = 'http://localhost:8081'

// 引入v-md-editor预览组件
app.use(VMdPreview);
app.use(createPinia())
app.use(ElementPlus)
app.use(router)
app.use(store)
app.mount('#app')


// 添加路由全局守卫
router.beforeEach((to, from, next) => {

    window.document.title = "BBS论坛-五人垃圾桶"
    //console.log(store.state.authHeader['jwtToken'])
    // 判断是否需要验证登录
    if (to.meta.requiresAuth) {
        if (store.state.authHeader['jwtToken']) {
            // 需要验证登录，设置请求头信息
            // 发送验证请求
            getWithToken('/api/user/authentication',
                (data, code, message) => {
                    // 验证成功，跳转到目标页面
                    next()
                },
                (data, code, message) => {
                    // 验证失败，跳转到登录页面
                    ElMessage.warning("token失效,请进行登录")
                    next('/welcome')
                }
            )
        } else {
            // 需要验证登录，但没有 token，跳转到登录页面
            ElMessage.warning("请进行登录")
            next('/welcome')
        }
    }else if( to.meta.requiresLogin){
        //
        // console.log(store.state.authHeader['jwtToken'])
        if (store.state.authHeader['jwtToken']) {
            // 需要验证登录，设置请求头信息
            // 发送验证请求
            getWithToken('/api/user/authentication',
                (data, code, message) => {
                    // 验证成功，跳转到目标页面
                    next('/person')
                },
                (data, code, message) => {
                    // 验证失败，跳转到登录页面
                    ElMessage.warning("token失效,请进行登录")
                    next()
                }
            )
        }
        else {
            // 需要验证登录，但没有 token，跳转到登录页面
            next()
        }
    }else if( to.meta.requiresAdmin){
        if (store.state.authHeader['jwtToken']) {
            // 需要验证登录，设置请求头信息
            // 发送验证请求
            getWithToken('/api/user/info',
                (data, code, message) => {
                    if (data.userRole === 'admin') {
                        // 验证成功，跳转到目标页面
                        next('/admin')
                    } else {
                        next('/person')
                    }
                },
                (data, code, message) => {
                    // 验证失败，跳转到登录页面
                    ElMessage.warning("token失效,请进行登录")
                    next('/welcome')
                }
            )
        }
        else {
            // 需要验证登录，但没有 token，跳转到登录页面
            next('/welcome')
        }
    }
    else {
        // 不需要验证登录，直接跳转到目标页面
        next()
    }
})
